<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>订单详情页面</title>
<link rel="stylesheet" href="layui/css/layui.css" />
<script type="text/javascript" src="layui/layui.js"></script>
</head>
<body>
	<div class="layui-form" style="margin-top: 20px" onsubmit="false">
		<div class="layui-form-item" hidden="hidden">
			<label class="layui-form-label">订单编号:</label>
			<div class="layui-input-inline" style="width: 130px">
				<input type="text" name="of_id" id="of_id" class="layui-input"
					lay-verify="required" placeholder="请输入订单编号">
			</div>
			<label class="layui-form-label">下单人:</label>
			<div class="layui-input-inline" style="width: 130px">
				<input type="text" name="u_name" id="u_name" class="layui-input"
					lay-verify="required" placeholder="请输入用户名称">
			</div>
			<label class="layui-form-label">订单状态</label>
						<div class="layui-input-inline" style="width: 120;">
							<select name="of_state" id="of_state" class="layui-input">
								<option value=''>请选择状态</option>
								<option value="下单未付款">下单未付款</option>
								<option value="付款未发货">付款未发货</option>
								<option value="付款己发货">付款己发货</option>
								<option value="收货未评价">收货未评价</option>
								<option value="收货已评价">收货已评价</option>
							</select>
						</div>
			<button class="layui-btn" id="serach" data-type="reload">查询</button>
		</div>
	</div>
	<table class="layui-hide" id="demo" lay-filter="demo"></table>
	<script>
		layui
				.use(
						[ 'form', 'layer', 'jquery', 'table' ],
						function() {
							var layer = layui.layer, $ = layui.jquery, form = layui.form, table = layui.table;
							var $ = layui.jquery;//引入jquery
							//执行渲染
							table
									.render({
										elem : '#demo' //指定原始表格元素选择器（推荐id选择器）
										,
										url : '/wk1un2_electricity_digital/Backstage/getAllOrderForm',
										where : {
											of_id : '',
											u_name : '',
											of_state : ''
										},
										method : 'POST',
										cols : [ [ {
											type : "checkbox",
											fixed : 'left',
											width : 50
										}, {
											field : 'p_id',
											title : '商品编号',
											fixed : 'left',
											align : 'center',
											width : 100
										}, {
											field : 'p_name',
											title : '商品名称',
											align : 'center',
											width : 200
										}, {
											field : 'od_num',
											title : '商品数量',
											align : 'center',
											width : 100
										}, {
											field : 'od_totalprice',
											title : '商品总价格',
											align : 'center',
											width : 120
										}, {
											field : 'of_message',
											title : '快递备注',
											align : 'center',
											width : 100,
										}, {
											field : 'of_state',
											title : '订单状态',
											align : 'center',
											width : 100,
										}, {
											field : 'of_ordertime',
											title : '下单时间',
											align : 'center',
											width : 200,
										}, {
											field : 'of_sendout',
											title : '是否发货',
											align : 'center',
											width : 100,
										}, {
											field : 'of_finishtime',
											title : '订单完成时间',
											align : 'center',
											width : 200,
										}, {
											field : 'of_deliverytime',
											title : '发货时间',
											align : 'center',
											width : 200,
										}, {
											field : 'of_receivetime',
											title : '收货时间',
											align : 'center',
											width : 200,
										} ] ],
										page : true,
										id : 'testReload'
									});

							$('#serach').on('click', function() {
								var of_id = $("#of_id").val();//上面搜索框的id
								var u_name = $("#u_name").val();//上面搜索框的id
								var of_state = $("#of_state").val();//上面搜索框的id
								table.reload('testReload', {//testReload,上面渲染逼格的id
									where : {//接口需要请求的参数
										'of_id' : of_id,
										'u_name' : u_name,
										'of_state' : of_state
									}
								});
							});

						});
	</script>
</body>
</html>